<!DOCTYPE html>
  <html>
  <head>
      <meta charset="utf-8">
      <meta name="viewport" content="maximum-scale=1.0,minimum-scale=1.0,user-scalable=0,width=device-width,initial-scale=1.0"/>
      <title>title</title>
      <link rel="stylesheet" type="text/css" href="../../css/api.css"/>
      <style>
      *{ margin: 0; padding: 0}
.banner{width: 100%;box-sizing: border-box;overflow: hidden;}
.banner img{width: 100%;display: block;}
      #xm_cont{  padding-bottom: 0px;}
      #xm_cont  .title{ font-size: 14px; height: 52px; background: #FFF;border-bottom: 1px solid #F5F5F5;}
      #xm_cont .title  span{ display: block; float: left; width: 3px; height: 12px; background: #666666; line-height: 52px;margin-left: 15px; margin-right: 12px; margin-top: 20px}
      #xm_cont .title h3{ float: left; line-height: 52px; color: #333333;font-size: 16px;}
      #xm_cont .cont_n{ width: 90%; margin: 5px auto; color: #999; font-size: 14px; line-height: 2em}
      #xm_cont .cont_n .col{margin-bottom: 0px;}
  #xm_cont .cont_n h2{color: #333;font-size: 14px;padding-top: 12px;}
#xm_cont .cont_n p{color: #999;font-size: 12px;}
#pintaijianjie{margin-bottom: 40px;}
      </style>
  </head>
  <body >
<div class="banner">
  <img src="../../image/jianjie.jpg" alt="">
</div>

<div  id="pintaijianjie">
    <div id="xm_cont" >
      <div class="title">
          <span></span>
          <h3>{{title1}}</h3>
      </div>
      <div class="cont_n" >
        <div class="col" v-for="site in item1">
        <h2>{{site.name}}</h2>
          <p>{{site.text}}</p>
          </div>
      </div>
    </div>
    <div id="xm_cont" >
      <div class="title">
          <span></span>
          <h3>{{title2}}</h3>
      </div>
      <div class="cont_n" >
        <div class="col" v-for="site in item2">
        <h2>{{site.name}}</h2>
          <p>{{site.text}}</p>
          </div>
      </div>
    </div>
    <div id="xm_cont" >
      <div class="title">
          <span></span>
          <h3>{{title3}}</h3>
      </div>
      <div class="cont_n" >
        <div class="col" v-for="site in item3">
        <h2>{{site.name}}</h2>
          <p>{{site.text}}</p>
          </div>
      </div>
    </div>
    <div id="xm_cont" >
      <div class="title">
          <span></span>
          <h3>{{title4}}</h3>
      </div>
      <div class="cont_n" >
        <div class="col" v-for="site in item4" >
        <h2>{{site.text}}</h2>
          <p>{{site.name}}</p>
          </div>
      </div>
    </div>
  </div>

  </body>
  <script type="text/javascript" src="../../script/api.js"></script>
    <script type="text/javascript" src="../../script/common.js"></script>
  <script type="text/javascript" src="../../script/vue.min.js"></script>
  <script type="text/javascript">
      apiready = function(){
        api.showProgress({
            style: 'default',
            animationType: 'fade',
            title: '努力加载中...',
            text: '先喝杯茶...',
            modal: false
        });

      pintaijianjie = new Vue({
                 el: '#pintaijianjie',
                 data: {
                    title1:"平台介绍",
                   item1: [
                           {id:1 ,name:"易挖平台是做什么的？",text:"为挖掘机行业用户提供简单的在线查询/对比购物体验。通过专业化的导购服务，以最具竞争力的品质服务优势，提供丰富的商品，以快速可靠的方式送达用户，并且提供灵活多样的支付方式，让用户购买挖掘机配件变得轻松简单。工机商城为用户提供产品种类包括：发动机系列、液压件系列、电器件系列、油封/密封件系列、轴承/齿轮系列、易损件系列、底盘件系列、附件及总成系列等;"},
                           {id:2,name:"易挖平台的宗旨是什么?",text:" 对商家我们进行严格审核，让用户在线查询，对比，采购挖掘机配件更简单快捷。下单后我们将在24小时内发货，以最大限度的降低用户的时间及成本。真正做到让用户买的放心，用的省心。我们联合品质优势厂家直销，降低用户采购成本。让用户的利益得到最大保证;"},

                         ],
               title2:"积分介绍",
                  item2: [
                                {id:1 ,name:"平台积分可以做什么的？",text:"为挖掘机行业用户提供简单的在线查询/对比购物体验。通过专业化的导购服务，以最具竞争力的品质服务优势，提供丰富的商品，以快速可靠的方式送达用户，并且提供灵活多样的支付方式，让用户购买挖掘机配件变得轻松简单。工机商城为用户提供产品种类包括：发动机系列、液压件系列、电器件系列、油封/密封件系列、轴承/齿轮系列、易损件系列、底盘件系列、附件及总成系列等;"},
                                {id:2,name:"如何积累积分？",text:" 对商家我们进行严格审核，让用户在线查询，对比，采购挖掘机配件更简单快捷。下单后我们将在24小时内发货，以最大限度的降低用户的时间及成本。真正做到让用户买的放心，用的省心。我们联合品质优势厂家直销，降低用户采购成本。让用户的利益得到最大保证;"},

                              ],
                  title3:"会员介绍",
                  item3: [
                           {id:1 ,name:"易挖会员可以做什么的？",text:"为挖掘机行业用户提供简单的在线查询/对比购物体验。通过专业化的导购服务，以最具竞争力的品质服务优势，提供丰富的商品，以快速可靠的方式送达用户，并且提供灵活多样的支付方式，让用户购买挖掘机配件变得轻松简单。工机商城为用户提供产品种类包括：发动机系列、液压件系列、电器件系列、油封/密封件系列、轴承/齿轮系列、易损件系列、底盘件系列、附件及总成系列等;"},
                               {id:2,name:"会员的权限有哪些？",text:" 对商家我们进行严格审核，让用户在线查询，对比，采购挖掘机配件更简单快捷。下单后我们将在24小时内发货，以最大限度的降低用户的时间及成本。真正做到让用户买的放心，用的省心。我们联合品质优势厂家直销，降低用户采购成本。让用户的利益得到最大保证;"},

                               ],
                               title4:"曝光台",
                               item4: [
                                        {id:1 ,name:"曝光台将会定期曝光违规的机手"},


                                            ],

                 },
                method:{


                    }

             });
             ajax();


             };
             var pintaijianjie


             function ajax(){
               api.ajax({
                   url: $api.getStorage("backapi")+'/index.php?c=home&m=ptjj',
                   method: 'get',
               },function(ret, err){
                   if (ret) {
                     console.log( JSON.stringify( ret ) );
                       pintaijianjie.item1=ret.status.item1
                       pintaijianjie.item2=ret.status.item2
                       pintaijianjie.item3=ret.status.item3
                   } else {
                       console.log( JSON.stringify( err ) );
                   }
                   api.hideProgress();

               });

             }
  </script>
  </html>
